<template>
  <div>
    <!-- 引入头部标签 -->
    <van-sticky @scroll="scrollHandler">
  <!--当前组件的状态通过滚动事件修改后将其传递到子组件-->
      <Header :topStatus="status"></Header>
    </van-sticky>
    <!-- 子路由渲染容器 -->
    <router-view></router-view>
    <div style="height:40px"></div>
  </div>
</template>

<script>
import Header from "@/components/Navgator/Header.vue";
import Vue from "vue";
import { Sticky } from "vant";

Vue.use(Sticky);

export default {
  components: { Header },
  data() {
    return {
      status: false
    }
  },
  methods:{
    scrollHandler(event){
      // console.log('滚动了');
      this.status = event.scrollTop >150
    }
  }
};
</script>

<style lang="scss" scoped>
</style>